<template>
    <div>
        <TabBar @content="getContent"></TabBar>
        <div id="bar-item">{{ content }}</div>
    </div>
</template>

<script>
import TabBar from './components/TabBar.vue';
export default {
    components: {
        TabBar,
    },
    data() {
        return {
            content: ''
        }
    },
    methods: {
        getContent(value) {
            this.content = value;
        }
    },
}
</script>

<style scoped>
#bar-item {
    text-align: center;
    padding: 20px;
    background-color: rgb(249 248 248);
}
</style>